<table id="<%= id ||= nil %>" class="<%= table_class ||= 'generic_datatable' %> table table-striped table-bordered" >
  <% if defined? title %>
    <caption><h3><%= title %></h3></caption>
  <% end %>
  <thead>
    <tr>
      <th>Person</th>
      <th>Status</th>
      <th>Start</th>
      <th>End</th>
      <th>Duration</th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <% timecards.each do |timecard| %>
      <tr>
        <td><%= link_to timecard.person.fullname, person_path(timecard.person) %></td>
        <td><%= link_to timecard.status, timecard_path(timecard), id: "js-timecard-status-id-#{timecard.id}" %></td>
        <td><%= timecard.start_time.strftime('%a %b %d %Y %k:%M') if timecard.start_time %></td>
        <td><%= timecard.end_time.strftime('%a %b %d %Y %k:%M') if timecard.end_time%></td>
        <td><%= timecard.duration %></td>
        <td>
          <% if (can? :verify, timecard) && timecard.status == 'Unverified' %>
            <%= button_to 'Verify',
              timecard_verify_path(timecard),
              form_class: 'timecard-verify',
              params: { id: timecard.id },
              id: "js-timecard-verify-btn-id-#{timecard.id}",
              class: 'js-timecard-verify-btn btn btn-xs btn-success'
            %>
          <% end %>
          <%= table_button_link 'Edit', edit_timecard_path(timecard) if can? :edit, timecard %>
        </td>
      </tr>
    <% end %>
  </tbody>
</table>
